<template>
	<view class="share-box">
		<view class="share-text">
			{{content}}
		</view>
		<view class="share-goods">
			<view class="goods-block"
			v-for="(item,index) in itemList" :key="index"
			@tap="goodDetail(
			item.goodsId,
			item.coupon_amount,
			item.price,
			item.commission_rate,
			item.coupon_start_time,
			item.coupon_end_time
			)"
			>
				<image :src="getimg(item.img)" class="goods-img"></image>
				<view class="goods-price">￥{{item.price}}</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default{
		name:"shareBox",
		data(){
			return{
			}
		},
		props:{
			itemList:{
				type:Array
			},
			content:{
				type:String
			}
		},
		methods:{
			getimg(img){//处理图片路径
				return  this.$CommonJS.getBaseImgUrl(img);
			},
			goodDetail(id,coupon_amount,price,commission_rate,coupon_start_time,coupon_end_time){
				//计算佣金
				const _this = this;
				const yongjin = ((price - coupon_amount)*commission_rate/10000*0.8).toFixed(2);
				uni.setStorage({
					key:"yongjin",
					data:yongjin,
					success() {
						//查看商品详情
						_this.$emit('goodDetail',id);
					}
				})
				
			}
		}
	}
</script>

<style scoped>
	.share-box{
		width: calc(100% - 100upx);
		height: auto;
		padding: 0 50upx;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: flex-start;
	}
	.share-text{
		width: 100%;
		font-size:14px;
		font-family:Alibaba PuHuiTi;
		font-weight:400;
		line-height:40upx;
		color:rgba(17,23,57,1);
		opacity:1;
	}
	.share-goods{
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: flex-start;
		flex-wrap: wrap;
		margin-top: 34upx;
		margin-bottom: 29upx;
	}
	.goods-block{
		width:214upx;
		height:214upx;
		background:rgba(240,243,247,1);
		opacity:1;
		position: relative;
		margin-right: 4upx;
		margin-bottom: 4upx;
	}
	.goods-block:nth-child(3n){
		margin:0;
	}
	.goods-img{
		width:214upx;
		height:214upx;
	}
	.goods-price{
		position: absolute;
		right: 0;
		bottom: 0;
		width: 130upx;
		height: 50upx;
		text-align: center;
		line-height: 50upx;
		font-size: 14px;
		color: #FFFFFF;
		background: red;
	}
</style>
